<%--
  Created by IntelliJ IDEA.
  User: ano
  Date: 2024/1/10
  Time: 17:08
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    /*获取项目的根路径*/
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://" + request.getServerName()+":"+request.getServerPort()+path+"/";
    /*basePath就是得到的跟路径类似于：http://localhost:8081/test/*/
%>
<html>
<head>
    <title>registry</title>
    <link rel="stylesheet" href="<%=basePath%>/css/public.css">
    <script src="<%=basePath%>/js/jquery-3.7.1.min.js"></script>
    <%--在registry页面引入layui框架--%>
    <link rel="stylesheet" href="<%=basePath%>/layui/css/layui.css">
    <script src="<%=basePath%>/layui/layui.js"></script>
</head>
<body style="background: linear-gradient(rgba(216,192,229,0.48), rgba(184,198,224,0.49))">
    <%--onsubmit="return false"：取消form表单的自动提交--%>
    <form class="registryForm" onsubmit="return false" style="margin: 35px">
        账号：<input type="text" name="userName" placeholder="请输入账号">
        <br>
        密码：<input type="password" name="password" placeholder="请输入密码">
        <br>
        <div class="options myFlex_x">
            <input class="doRegistry" type="submit" value="注册" style="margin-right: 10px;">
            <input type="reset">
        </div>
    </form>
<script>
    $(".doRegistry").click(function (){
        /*访问后端，将用户输入的数据提交到后端
        后端访问数据库，判断用户账号密码是否输入重复
        重复就注册失败，不重复就插入user表并且注册成功*/
        $.ajax({
            url:"<%=basePath%>/user?method=registry",  // 请求地址
            type:"get",  // 请求方式
            data:$(".registryForm").serialize(),   // serialize：获取当前form表单中输入框的值
            success:function (result){
                // 将字符串result转换为number类型
                var res=Number(result);
                if (res==0){
                    layer.msg('账号已存在！', {
                        icon: 2,// 弹窗样式
                        time: 2000 //2秒关闭（如果不配置，默认是3秒）
                    });
                }else if(res<1){
                    layer.msg('注册失败，请稍后再试！', {
                        icon: 2,// 弹窗样式
                        time: 2000 //2秒关闭（如果不配置，默认是3秒）
                    });
                }else {
                    layer.msg('注册成功！', {
                        icon: 1,// 弹窗样式
                        time: 2000 //2秒关闭（如果不配置，默认是3秒）
                    }, function(){
                        // 自动关闭弹窗：当你在iframe页面关闭自身时
                        var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                        parent.layer.close(index); //再执行关闭
                    });
                }
            }
        })
    })
</script>
</body>
</html>
